<template>
    <Modal v-model="modal.show" width="350" :title="modal.title">
        <Form ref="formRef" :model="formItem" :rules="ruleValidate" :label-width="120">
            <FormItem label="所属院区" prop="areaID">
                <Select v-model="formItem.areaID" style="width:200px" label-in-value>
                    <Option v-for="item in areaList" :value="item.areaID" :key="item.areaID">{{ item.name }}
                    </Option>
                </Select>
            </FormItem>
            <FormItem label="院内科室名称" prop="name"><Input v-model="formItem.name" placeholder="" style="width: 200px" />
            </FormItem>
            <FormItem label="院内科室代码" prop="code"><Input v-model="formItem.code" placeholder="" style="width: 200px" />
            </FormItem>
            <FormItem label="标准科室名称" prop="name1"><Input v-model="formItem.name1" placeholder="" style="width: 200px" />
            </FormItem>
            <FormItem label="标准科室代码" prop="code1"><Input v-model="formItem.code1" placeholder="" style="width: 200px" />
            </FormItem>
            <FormItem label="是否为医疗组" prop="text">
                <Switch v-model="formItem.isGroup">
                    <template #open>
                        <span>是</span>
                    </template>
                    <template #close>
                        <span>否</span>
                    </template>
                </Switch>
            </FormItem>
        </Form>
        <template #footer>
            <div>
                <Button type="text" @click="closeModal">取消</Button>
                <Button type="primary" @click="handleOk">确定</Button>
            </div>
        </template>
    </Modal>
</template>
<script setup>
import http from '@/util/http'

let { proxy } = getCurrentInstance()
const emit = defineEmits(['initList', 'initTreeList'])
let modal = reactive({ show: false, title: '' })
const formRef = ref(null)
let areaList = reactive([])
let formItem = reactive({
    areaID: '',
    code: '',
    name: '',
    code1: '',
    name1: '',
    isGroup: false
})

const initAreaList = () => {
    http.get('/Basic/Area/List', {}, (response) => {
        areaList = response.data.data
    })
}
initAreaList();

const ruleValidate = {
    areaID: [{ required: true, message: '请输入', trigger: 'blur' }],
    code: [{ required: true, message: '请输入', trigger: 'blur' }],
    name: [{ required: true, message: '请输入', trigger: 'blur' }],
    code1: [{ required: true, message: '请输入', trigger: 'blur' }],
    name1: [{ required: true, message: '请输入', trigger: 'blur' }],
}


const closeModal = () => {
    modal.show = false
}

const show = (type, data) => {
    formRef.value.resetFields()
    modal.show = true

    if (type == 1) {
        modal.title = '添加科室'
    } else {
        formItem.categoryID = data.categoryID
        formItem.areaID = data.areaID
        formItem.code = data.code
        formItem.name = data.name
        formItem.code1 = data.code1
        formItem.name1 = data.name1
        formItem.isGroup = data.isGroup
        modal.title = '编辑科室'
    }
}

const handleOk = () => {
    formRef.value.validate((valid) => {
        if (valid) {
            http.post('/Basic/Category/AddOrUpdate', toRaw(formItem), (response) => {
                if (response.data.flag) {
                    emit('initList')
                    emit('initTreeList')

                    proxy.$Message.success(response.data.msg)
                    modal.show = false
                } else {
                    proxy.$Message.error(response.data.msg)
                }
            })
        } else {
            return false
        }
    })
}

defineExpose({
    show,
})
</script>